<template>
  <div class="el-mr-pareturnTable">
    <!-- <div class="el-mr-TableTitle">
      <p>零件退货单申请表</p>
    </div> -->
    <div class="el-mr-mh-firstbg">
      <el-table
        ref="receiveTable"
        size="mini"
        :data="resData"
        @selection-change="handleSelectionChange"
        style="width: 100%"
        highlight-current-row
        height="300"
      >
      <el-table-column type="selection" width="40"> </el-table-column>
      <el-table-column type="index" label="序号" width="50" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="returnStatus" label="退库状态" width="110" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="returnType" label="退库类型" width="130" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="itemCode" label="图号" width="170" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="mdsItemDTOList[0].itemName" label="物料名称" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="wmsDeliverPlanDTOList[0].qualityCode" label="质量编号/件号" width="130" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="returnQty" label="退库数量" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="applyOrgCode" label="退库移交单位" width="100" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="accordingNo" label="退库依据" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="failureDesc" label="故障现象" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="remark" label="备注" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="wmsDeliverPlanDTOList[0].productCode" label="机型" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="wmsDeliverPlanDTOList[0].batchNo" label="批次" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="wmsDeliverPlanDTOList[0].startLotNo" label="起始架次" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="wmsDeliverPlanDTOList[0].endLotNo" label="截止架次" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="applyEmpCode" label="申请人" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="applyDate" label="申请日期" width="110" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="rejectEmpCode" label="驳回人" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="rejectReason" label="驳回原因" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="rejectDate" label="驳回日期" width="110" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column prop="ynWorkLineFlag" label="是否按原分工生成返修计划" width="170" :show-overflow-tooltip="true"> </el-table-column>
      <el-table-column fixed="right" label="操作" width="120">
          <template slot-scope="scope">
            <el-button @click.native.prevent="showRow(scope.$index, resData)" type="text" size="small">
                查看所在缓存箱
            </el-button>
          </template>
      </el-table-column>  
    </el-table>
      <!-- 分页 -->
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageNumber"
        :page-sizes="[10,20,50,100]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="totalCount">
      </el-pagination>

       <!--查看物料所在箱子列表-->
    <el-drawer title="物料所在缓存箱列表" :visible.sync="drawer.drawer" :direction="drawer.direction">
      <el-table :data="drawer.dataList" style="width: 100%">
          <el-table-column  prop="workbinCode" label="缓存箱"> </el-table-column>
          <el-table-column  prop="itemQty" label="数量" > </el-table-column>
          <el-table-column  prop="currentQty" label="当前台账剩余数量" > </el-table-column>
          <el-table-column  prop="erpoutQty" label="此缓存箱出库数量" > </el-table-column>
      </el-table>
    </el-drawer>
    </div>
  </div>
</template>
<script>

import { mrMhAll } from "@/utils/api.js";
import request from "@/utils/request.js";

export default {
  name: "PareturnTable",
  data() {
    return {
      // 当前页数
      pageNumber: 1,
      // 数据总个数
      totalCount: 0,
      // 返回的数据数组
      resData: [],
      // 每页数据个数
      pageSize: 20,
      // 确认列表高亮参数
      stableIndex: 0,
      // 保存勾选数据的退货单ID
      returnOrderID:[],
      // 保存勾选数据的退货状态
      returnStatus:[],
      queryParam:{},
      drawer:{
        drawer: false,
        direction:"rtl",
        dataList:[],
        queryParam:{}
      }
  };
  },
  methods: {
    // 勾选函数
    handleSelectionChange(val){
      if(val.length > 0) {
        this.returnOrderID = []
        this.returnStatus = []
        for(let i=0;i<val.length;i++){
          this.returnOrderID.push(val[i].wmsReturnApplyId)
          this.returnStatus.push(val[i].returnStatus)
        }
        // console.log(val,this.returnOrderID)
        // 将退货单ID传给midBtn的修改按钮
        this.$bus.$emit('sendPartReturnOrderID',{returnOrderID:this.returnOrderID,returnStatus:this.returnStatus})
        // 将val信息给midBtn 缓存箱出库 条件暂定
        this.$bus.$emit('sendHcxInfoVal',val)
        // 将信息给info框
        this.$bus.$emit('mrPrtInfoKuang',val)
        // 传给midBtn 物料出库所需
        this.$bus.$emit('sendMaterialOutInfo',val)
      }
      // console.log(val,val[0].itemCode)
      
    },
    // 选择每页条数后请求接口更新表格
    handleSizeChange(val) {
      this.pageSize = val
      // 将新的每页数据条数给TopSearch查询数据
      this.$bus.$emit('prtMidTableDataNum',val)
    },
    // 分页--页数改变
    handleCurrentChange(val) {
      this.pageNumber = val
      // 将新的每页数据条数给TopSearch查询数据
      this.$bus.$emit('prtMidTableDataPage',{
                      pageNumber:this.pageNumber,
                      pageSize:this.pageSize
                    })
    },
    showRow(index,data){//显示缓存箱
            console.log("index",index);
            console.log("data",data[index]);
            this.drawer.queryParam = data[index];
            this.drawer.drawer = true;
            this.$options.methods.searchItemPallect.bind(this)();
    },
    searchItemPallect(para){
        console.log("para",para);
        request.post("/partSalesReturn/searchWorkbinMaterial",this.drawer.queryParam).then((res)=>{
            console.log("缓存箱",res);
            this.drawer.dataList = res.data;
        });
    }
  },
  mounted() {
    // 接收首页条件查询的数据进行展示
    this.$bus.$on('prSearchInfo',(e)=>{
      this.resData = e
    })
  },
};
</script>
<style scoped>
.el-mr-pareturnTable {
  width: 100%;
  height: 340px;
}
.el-mr-mh-firstbg {
  width: 100%;
  height: 100%;
  text-align: center;
}
.el-pagination {
  text-align: center;
}
.el-mr-TableTitle{
  font-size: 16px;
  padding: 5px 2px;
  background-color: rgb(57, 135, 199);
  color: white;
}
</style>